<!DOCTYPE html>
<html>
<head lang="en">
    <meta charset="UTF-8">
    <title>带关闭按钮的滚动广告</title>
    <style type="text/css">
        #main {
            text-align: center;
        }

        #float {
            position: absolute;
            left: 30px;
            top: 60px;
            z-index: 1;
        }

        #close {
            position: absolute;
            top: 60px;
            left: 134px;
            z-index: 2;
            cursor: hand;
        }

        #backTop {
            position: fixed;
            right: 10px;
            bottom: 0;

        }
    </style>
    <script src="../../js/jquery-3.5.1.js"></script>
</head>
<body onscroll="scrollF()">
<div id="close" onClick="adv_close()"><img src="images/close.jpg"></div>
<div id="float"><img src="images/advpic.jpg"></div>
<button id="backTop">回到顶部</button>
<div id="main"><img src="images/contentpic.jpg"></div>
<script type="text/javascript">
    function scrollF() {
        //滚动条事件
        var sTop = document.documentElement.scrollTop || document.body.scrollTop;
        document.getElementById("float").style.top = (60 + sTop) + "px";
    }

    $(function () {
        $("#backTop").click(function () {
            $("html").animate({"scrollTop":0},500);
        })
    })
</script>

</body>
</html>
